import React, { memo, useCallback, useState } from 'react';

const slow = () => {
	const [count, setCount] = useState(0);
	const [count1, setCount1] = useState(0);

	const cb = useCallback(() => { setCount(count + 1); }, [count]);

	return (
		<div>
			<div onClick={() => setCount1(count1 + 2)}>{count1}</div>
			<div>{count}</div>
			<Button2 cb={() => setCount(count + 1)} />
		</div>
	);
};

const Button2 = memo(Button);

function Button({ cb }: { cb?: () => void; }) {
	console.log('button enter');
	return (<>
		<button className='w-30 p-2 bg-red-400 text-white' onClick={cb}>increase</button>
	</>);
}


export default slow;
